<template>
  <div class="app-container">
    <!--查询表单-->
    <el-form :inline="true" class="demo-form-inline">
      <!-- 一级分类 -->
      <el-select v-model="grade" placeholder="年级" @change="classGradeChanged">
        <el-option v-for="grade in grades" :key="grade" :label="grade" :value="grade"/>
        <!-- key是唯一表标识，label是显示名，value是值 -->
      </el-select>

      <el-button type="primary" icon="el-icon-search" @click="getList()">查询</el-button>
    </el-form>

    <!-- <el-table :data="item" border fit highlight-current-row style="text-align:center">
      <el-table-column label="序号" width="70" align="center">
        <template slot-scope="scope">{{ (page - 1) * limit + scope.$index + 1 }}</template>
      </el-table-column>

      <el-table-column prop="courseName" label="年级" align="center"/>

    </el-table> -->
    <el-divider><i class="el-icon-mobile-phone"></i></el-divider>

    <el-table :data="item" style="width: 100%;box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1)" :row-class-name="tableRowClassName">
      <el-table-column label="序号" width="70" align="center">
        <template slot-scope="scope">{{ (page - 1) * limit + scope.$index + 1 }}</template>
      </el-table-column>
      <el-table-column prop="courseName" label="课程名称" align="center"></el-table-column>
      <el-table-column prop="classGrade" label="年级"  align="center"></el-table-column>
      <el-table-column prop="normalScore" label="平时成绩"  align="center"></el-table-column>
      <el-table-column prop="endScore" label="期末成绩"  align="center"></el-table-column>
      <el-table-column prop="totalScore" label="最终成绩" align="center"></el-table-column>

    </el-table>
  </div>
</template>


<script>
import org from "@/api/organization/organization.js"; //.js可以省略
import stu from "@/api/personnel/student";
import sc from "@/api/score/score";
import stusc from "@/api/stuScore/stuScore";

export default {
  //2、写核心代码位置
  //data两种写法：
  // data:{
  // },
  data() {
    //定义数据变量和初始值
    return {
      coursesAndGrade: [],
      courseVo: {},
      //这里属性名可以自己起
      list: null, //查询之后接口返回集合
      total: 0,
      page: 1, //当前页
      limit: 30, //每页显示记录数
      studentDto: {}, //条件封装对象
      item: [],
      sysClassinfos: {}, //所有专业下的班级
      sysScore: {},
      scoreInfoDto: {}, //查询成绩录入回显
      grades: {},
      grade: null
    };
  },
  created() {
    this.gradeInfo();
  },
  methods: {
    gradeInfo() {
      stusc
        .gradeInfo()
        .then(response => {
          this.grades = response.data.grades;
          console.log(this.grades);
        }) //请求成功
        .catch(error => {
          console.log(error);
        }); //请求失败
    },

    getList() {
      stusc
        .scoreInfo(this.grade)
        .then(response => {
          this.item = response.data.item;
          console.log(this.item);
        }) //请求成功
        .catch(error => {
          console.log(error);
        }); //请求失败
    }
  }
};
</script>
<style>
  .el-table .warning-row {
    background: oldlace;
  }

  .el-table .success-row {
    background: #f0f9eb;
  }
</style>